<nav class="card mb-3">
  <div class="card-body">
    <section>
      <div class="btn-toolbar mb-3">
        <%= render partial: '/movies/filter_nav', locals: {
          param_name: :order,
          options: %i[default latest_first oldest_first],
        } %>

        <%= render partial: '/movies/filter_nav', locals: {
          param_name: :vr,
          options: %i[yes no],
        } %>
      </div>
      <% if signed_in? %>
        <div class="btn-toolbar mb-3">
          <%= render partial: '/movies/filter_nav', locals: {
            param_name: :vote,
            options: %i[up down bookmark none],
          } %>

          <% if current_user.is_admin? %>
            <%= render partial: '/movies/filter_nav', locals: {
              param_name: :resource,
              options: Resource.distinct.pluck(:tags).flatten.sort.uniq.map(&:to_sym),
            } %>
          <% end %>
        </div>
      <% end %>
    </section>

    <%= form_tag movies_url, method: :get, class: 'form-inline' do %>
      <input name="vote" type="hidden" value="<%= @vote %>" />
      <input name="resource" type="hidden" value="<%= @resource %>" />
      <div class="input-group">
        <%= text_field_tag('fuzzy', params[:fuzzy], class: 'form-control') %>
        <div class="input-group-append">
          <%= submit_tag 'Fuzzy Match', class: 'btn btn-success' %>
        </div>
      </div>
    <% end %>
  </div>
</nav>

<% if @movies.exists? %>
  <%= render partial: '/movies/pager', object: @movies %>

  <% @movies.in_groups_of(4).each do |group| %>
    <div class="movies card-deck mb-3">
      <% group.each do |movie| %>
        <% if movie %>
          <div class="movie card">
            <%= link_to image_tag(movie.cover_image, class: "card-image-top img-fluid"), movie%>
            <div class="card-body">
              <%= link_to movie, class: 'card-title' do %>
                <span><%= movie.code %></span>
                <span><%= movie.title %></span>
              <% end %>
              <% if movie.actresses %>
                <p class="mb-0">
                  <% movie.actresses.each do |actress| %>
                    <span class="badge"><%= actress %></span>
                  <% end %>
                </p>
              <% end %>
            </div>
            <div class="card-footer text-right">
              <%= render partial: '/movies/voter', locals: { movie: movie, height: nil } %>
            </div>
          </div>
        <% else %>
          <div class="card"></div>
        <% end %>
      <% end %>
    </div>
  <% end %>

  <%= render partial: '/movies/pager', object: @movies %>
<% else %>
  <div class="jumbotron">
    <p>No movie matching given criterias</p>
  </div>
<% end %>